<page-header>
</page-header>
<nz-spin [nzSpinning]="userLoading">
  <div class="main" *ngIf="user">
    <div class="left">
      <form nz-form nzLayout="vertical" #f="ngForm" (submit)="save()" se-container="1">
        <se label="姓名" error="请输入员工姓名!">
          <input nz-input [(ngModel)]="user.name" name="name" required>
        </se>
        <se label="性别">
          <nz-select [(ngModel)]="user.gender" name="gender" required>
            <nz-option nzLabel="男" nzValue="男"></nz-option>
            <nz-option nzLabel="女" nzValue="女"></nz-option>
          </nz-select>
        </se>
        <se label="出生日期" error="请输入标题">
          <nz-date-picker [(ngModel)]="user.birthday" name="birthday" (ngModelChange)="onChange($event)"></nz-date-picker>
        </se>
        <se label="状态">
          <nz-select [(ngModel)]="user.status" name="status" required>
            <nz-option nzLabel="待入职" nzValue="待入职"></nz-option>
            <nz-option nzLabel="待转正" nzValue="待转正"></nz-option>
            <nz-option nzLabel="在职" nzValue="在职"></nz-option>
            <nz-option nzLabel="待离职" nzValue="待离职"></nz-option>
            <nz-option nzLabel="离职" nzValue="离职"></nz-option>
          </nz-select>
        </se>
        <se label="籍贯" error="请输入员工籍贯!">
          <input nz-input [(ngModel)]="user.nativePlace" name="nativePlace">
        </se>
        <se label="所在部门">
          <nz-select [(ngModel)]="user.department" name="department" required>
            <nz-option nzLabel="技术部" nzValue="技术部"></nz-option>
            <nz-option nzLabel="销售部" nzValue="销售部"></nz-option>
            <nz-option nzLabel="市场部" nzValue="市场部"></nz-option>
            <nz-option nzLabel="企划部" nzValue="企划部"></nz-option>
            <nz-option nzLabel="产品部" nzValue="产品部"></nz-option>
            <nz-option nzLabel="人事部" nzValue="人事部"></nz-option>
          </nz-select>
        </se>
        <se label="是否结婚">
          <nz-select [(ngModel)]="user.marriage" name="marriage" required>
            <nz-option nzLabel="是" nzValue="是"></nz-option>
            <nz-option nzLabel="否" nzValue="否"></nz-option>
          </nz-select>
        </se>
        <se label="最高学历">
          <nz-select [(ngModel)]="user.education" name="education" required>
            <nz-option nzLabel="初中及以下" nzValue="初中及以下"></nz-option>
            <nz-option nzLabel="高中/高职" nzValue="高中/高职"></nz-option>
            <nz-option nzLabel="大专" nzValue="大专"></nz-option>
            <nz-option nzLabel="本科" nzValue="本科"></nz-option>
            <nz-option nzLabel="硕士" nzValue="硕士"></nz-option>
            <nz-option nzLabel="博士" nzValue="博士"></nz-option>
          </nz-select>
        </se>
        <se label="职位" error="请输入员工职位!">
          <input nz-input [(ngModel)]="user.post" name="post">
        </se>
        <se label="薪水">
          <input nz-input [(ngModel)]="user.salary" name="salary">
        </se>
        <se label="联系电话" error="请输入员工电话!">
          <input nz-input [(ngModel)]="user.phoneNumber" name="phoneNumber">
        </se>
        <se label="住址">
          <input nz-input [(ngModel)]="user.address" name="address" placeholder="XX区XXX路 XX 号">
        </se>
        <se>
          <button nz-button nzType="primary" [disabled]="f.invalid">提交</button>
        </se>
      </form>
    </div>
    <div class="right">
      <div class="avatar_title">Avatar</div>
      <div class="avatar"><img src="{{user.avatar}}" alt="Avatar"></div>
      <nz-upload nzAction="/user/avatar" [nzShowUploadList]="false">
        <button nz-button class="button_view">
          <i class="anticon anticon-upload"></i>
          <span>更换头像</span>
        </button>
      </nz-upload>
    </div>
  </div>
</nz-spin>
